import { useEffect, useState } from "react";
const URL = "http://geek.itheima.net/v1_0/channels";

function App() {
  const [count, setCount] = useState([]); 
  useEffect(() => {
    async function getData() {
      const res = await fetch(URL);
      const data = await res.json();
      setCount(data.data.channels);
    }
    getData();
  }, []); // 添加空依赖数组以确保只在组件挂载时运行一次

  return (
    <div>
      <ul>
        {count.map(item => (
          <li key={item.id}>{item.name}</li>
        ))}
      </ul>
    </div>
  );
}

export default App;